<!--
角色管理页
单仕瑞
2017年4月12日 13:44:41
-->
<template>
  <div>
    <el-form :inline="true" class="clearfix">
      <el-form-item>
        <el-input v-model="addressStr" size="small" placeholder="配电箱名称" style="vertical-align: top"></el-input>
      </el-form-item>
      <!--<el-form-item>-->
      <!--<el-input v-model="powerUnitStr" size="small" placeholder="权属单位" style="vertical-align: top"></el-input>-->
      <!--</el-form-item>-->
      <el-form-item>
        <el-button type="primary" @click="search" size="small" style="line-height:14px;vertical-align: top;">查询


        </el-button>
        <el-button type="primary" @click="handleAdd" size="small" style="line-height:14px;vertical-align: top;">新增配电箱


        </el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="danger" @click="batchDelete" :disabled="this.sels.length===0" v-if="getAuth(3)" size="small"
                   style="line-height:14px;vertical-align: top;">批量删除


        </el-button>
        <el-button type="primary" @click="uploadDialog = true" size="small"
                   style="line-height:14px;vertical-align: top;">导入


        </el-button>
        <el-button type="primary" @click="exportExcel" size="small" style="line-height:14px;vertical-align: top;">导出


        </el-button>
      </el-form-item>
    </el-form>
    <div v-if="isshow">
      <!--列表-->
      <el-table :data="list" @selection-change="selsChange" border style="width: 100%; font-size: 12px;"
                row-class-name="tabRow" v-loading="listLoading" tooltipEffect="light">
        <el-table-column type="selection" v-if="getAuth(3)"></el-table-column>
        <el-table-column align="center" prop="name" label="配电箱名称"></el-table-column>
        <el-table-column align="center" prop="lngLat" label="经纬度"></el-table-column>
        <el-table-column align="center" prop="deptname" label="所属部门"></el-table-column>
        <el-table-column align="center" label="操作">
          <template scope="scope">
            <el-button size="mini" type="warning" @click="handleEdit(scope.$index, scope.row)" v-if="getAuth(4)">编辑


            </el-button>
            <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)" v-if="getAuth(2)">删除


            </el-button>
            <el-button size="mini" type="primary" @click="handleDetail(scope.$index, scope.row)">详情</el-button>
            <el-button size="mini" type="primary" @click="runNumber(scope.$index, scope.row)"
                       title="后台自动计算出电缆长度、灯杆数量、灯具数量、灯杆号段的数值">跑批数据


            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-col :span="24" class="toolbar" v-show="!listLoading" style="margin-top: 15px;">
        <el-pagination layout="total, sizes, prev, pager, next, jumper" :page-sizes="[10, 20, 30]"
                       @size-change="handleSizeChange"
                       @current-change="handleCurrentChange" :page-size="pageSize" :total="total" style="float:right;"
                       id="pagination">
        </el-pagination>
      </el-col>

      <!--新增/修改-->
      <el-dialog :title="dialogTitle" :visible.sync="showAdd" :close-on-click-modal="false" @close="clearValidate"
                 custom-class="el-dialog--small">
        <el-form :model="deptEntity" label-width="140px" :rules="deptFormRules" ref="dept" style="margin-top:-20px">
          <el-form-item label="所属部门" prop="deptid">
            <el-select v-model="deptEntity.deptid" style="width: 100%" @change="getTeamList" disabled>
              <el-option v-for="(item, index) in deptList" :key="index" :label="item.deptName" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="所属班组" prop="treamId">
            <el-select v-model="deptEntity.treamId" style="width: 100%">
              <el-option v-for="(item, index) in teamList" :key="index" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="名称" prop="name">
            <el-input v-model="deptEntity.name" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="经纬度" prop="lngLat">
            <el-input v-model="deptEntity.lngLat" :disabled="this.checkDeptName" size="small"></el-input>
          </el-form-item>
          <el-form-item label="地址" prop="address">
            <el-input v-model="deptEntity.address" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="控制箱编号" prop="number">
            <el-input v-model="deptEntity.number" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="接入变压器" prop="jointransformer">
            <el-select v-model="deptEntity.jointransformer" style="width: 100%">
              <el-option v-for="(item, index) in byqList" :key="index" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="上级电源" prop="pidpower">
            <el-input v-model="deptEntity.pidpower" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <template v-if="deptEntity.jointransformer == '专变'">
            <div class="title">专变</div>
            <div class="box">
              <el-form-item label="专变容量" prop="zbcapacity">
                <el-input v-model="deptEntity.zbcapacity" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="安装地址" prop="zbcapacityaddress">
                <el-input v-model="deptEntity.zbcapacityaddress" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="变压器生产厂家" prop="transformercompant">
                <el-input v-model="deptEntity.transformercompant" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="专变型号" prop="capacitytype">
                <el-input v-model="deptEntity.capacitytype" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="变压器出厂编号" prop="transformercompantno">
                <el-input v-model="deptEntity.transformercompantno" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="变压器生产日期" prop="transformerstart">
                <el-date-picker v-model="deptEntity.transformerstart" type="date" placeholder="选择日期" format="yyyy-MM-dd"
                                value-format="yyyy-MM-dd" @change="getATime"></el-date-picker>
              </el-form-item>
              <el-form-item label="变压器额定电流" prop="ratedcurrent">
                <el-input v-model="deptEntity.ratedcurrent" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="A相负荷" prop="aload">
                <el-input v-model="deptEntity.aload" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="B相负荷" prop="bload">
                <el-input v-model="deptEntity.bload" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="C相负荷" prop="cload">
                <el-input v-model="deptEntity.cload" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
            </div>
            <div class="line"></div>
          </template>
          <el-form-item label="变低出线线缆名称" prop="xlname">
            <el-input v-model="deptEntity.xlname" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="变低出线规格型号" prop="xlggtype">
            <el-input v-model="deptEntity.xlggtype" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="变低出线安装地址" prop="azaddress">
            <el-input v-model="deptEntity.azaddress" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="变低出线长度" prop="cxlength">
            <el-input v-model="deptEntity.cxlength" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="材质" prop="texture">
            <el-input v-model="deptEntity.texture" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="安装类型" prop="aztype">
            <el-select v-model="deptEntity.aztype" style="width: 100%">
              <el-option v-for="(item, index) in aztypeList" :key="index" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="所属行政区域" prop="areaname">
            <el-select v-model="deptEntity.areaname" style="width: 100%" placeholder="行政区域"
                       :disabled="this.checkDeptName">
              <el-option v-for="(item, index) in areaList" :key="index" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="控制箱生产日期" prop="kzxstart">
            <el-date-picker
              v-model="deptEntity.kzxstart" @change="getBTime"
              type="date"
              placeholder="选择日期"
              format="yyyy-MM-dd" value-format="yyyy-MM-dd">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="控制箱投运日期" prop="kzxtystart">
            <el-date-picker v-model="deptEntity.kzxtystart" type="date" placeholder="选择日期" format="yyyy-MM-dd"
                            @change="getCTime" value-format="yyyy-MM-dd"></el-date-picker>
          </el-form-item>
          <div class="title">控制箱控制道路</div>
          <div class="box">
            <el-form-item label="道路" prop="kzxkzroute">
              <el-input v-model="deptEntity.kzxkzroute" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="电缆长度" prop="kzxdllength">
              <el-input v-model="deptEntity.kzxdllength" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="电缆型号" prop="kzxroutetype">
              <el-input v-model="deptEntity.kzxroutetype" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="敷设方式" prop="kzxps">
              <el-input v-model="deptEntity.kzxps" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="灯杆数量" prop="kzxroutedgnum">
              <el-input v-model="deptEntity.kzxroutedgnum" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="灯具数量" prop="kzxroutedjnum">
              <el-input v-model="deptEntity.kzxroutedjnum" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="灯杆号段" prop="kzxdghd">
              <el-input v-model="deptEntity.kzxdghd" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="道路等级" prop="kzxlevel">
              <el-input v-model="deptEntity.kzxlevel" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="功率" prop="kzxpower">
              <el-input v-model="deptEntity.kzxpower" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="安装类型" prop="kzxaztype">
              <el-input v-model="deptEntity.kzxaztype" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="总功率" prop="kzxtotalpower">
              <el-input v-model="deptEntity.kzxtotalpower" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <el-form-item label="电缆总长" prop="kzxdltotallength">
              <el-input v-model="deptEntity.kzxdltotallength" :disabled="this.checkDeptName" size="small"
                        :maxlength="255"></el-input>
            </el-form-item>
            <div class="line"></div>
          </div>
          <el-form-item label="终端编号" prop="terminalno">
            <el-input v-model="deptEntity.terminalno" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="终端厂家" prop="terminalcompany">
            <el-input v-model="deptEntity.terminalcompany" :disabled="this.checkDeptName" size="small"
                      :maxlength="255"></el-input>
          </el-form-item>
          <el-form-item label="终端安装日期" prop="terminalaztime">
            <el-date-picker v-model="deptEntity.terminalaztime" type="date" placeholder="选择日期" format="yyyy-MM-dd"
                            value-format="yyyy-MM-dd" @change="getDTime"></el-date-picker>
          </el-form-item>
          <el-form-item label="是否有外接电源设备" prop="iswjpower">
            <el-select v-model="deptEntity.iswjpower" style="width: 100%" placeholder="请选择"
                       :disabled="this.checkDeptName">
              <el-option v-for="(item, index) in nfList" :key="index" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <template v-if="deptEntity.iswjpower == '是'">
            <div class="title">外接电源设备</div>
            <div class="box">
              <el-form-item label="设备名称" prop="wjpowername">
                <el-input v-model="deptEntity.wjpowername" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="数量" prop="wjpowernum">
                <el-input v-model="deptEntity.wjpowernum" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="功率" prop="wjpower">
                <el-input v-model="deptEntity.wjpower" :disabled="this.checkDeptName" size="small"
                          :maxlength="255"></el-input>
              </el-form-item>
              <el-form-item label="接入时间" prop="wjpowertime">
                <el-date-picker v-model="deptEntity.wjpowertime" type="date" placeholder="选择日期" format="yyyy-MM-dd"
                                value-format="yyyy-MM-dd" @change="getETime"></el-date-picker>
              </el-form-item>
              <el-form-item label="是否有标识牌" prop="wjstate">
                <el-select v-model="deptEntity.wjstate" style="width: 100%" placeholder="请选择"
                           :disabled="this.checkDeptName">
                  <el-option v-for="(item, index) in nfList" :key="index" :label="item.name" :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </div>
            <div class="line"></div>
          </template>
          <!--<el-form-item label="所属班组" prop="groupName">-->
          <!--<el-input v-model="deptEntity.groupName" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>-->
          <!--</el-form-item>-->
          <!--<el-form-item label="监控品牌" prop="jkbrand">-->
          <!--<el-input v-model="deptEntity.jkbrand" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>-->
          <!--</el-form-item>-->
          <!--<el-form-item label="基础高度" prop="height">-->
          <!--<el-input v-model="deptEntity.height" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>-->
          <!--</el-form-item>-->
          <!--<el-form-item label="接线方式" prop="jxtype">-->
          <!--<el-input v-model="deptEntity.jxtype" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>-->
          <!--</el-form-item>-->
          <!--<el-form-item label="出线数量" prop="num">-->
          <!--<el-input v-model="deptEntity.num" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>-->
          <!--</el-form-item>-->
          <!--<el-form-item label="电表号" prop="gradeNum">-->
          <!--<el-input v-model="deptEntity.gradeNum" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>-->
          <!--</el-form-item>-->
          <el-form-item label="图片" prop="pic" style="width: 100%">
            <!--<el-input v-model="deptEntity.gradeNum" :disabled="this.checkDeptName" size="small" :maxlength="255"></el-input>-->
            <el-upload
              action="/smartLight/api/account/wxupload.htm" :limit="10"
              accept=".jpg,.png" :on-success="configPicSuccess" :on-remove="configPicRemove" :file-list="configPicList"
              list-type="picture-card"
              :auto-upload="true">
              <i slot="default" class="el-icon-plus"></i>
            </el-upload>
          </el-form-item>
        </el-form>

        <div scope="footer" class="dialog-footer"
             style="text-align: right;">
          <el-button @click.native="showAdd = false">取消</el-button>
          <el-button type="primary" @click.native="handleSubmit" :loading="saveDeptLoading">保存</el-button>
        </div>
      </el-dialog>

      <!--导入配电箱-->
      <el-dialog :visible.sync="uploadDialog" title="导入配电箱" @close="importList = []">
        <el-upload
          style="width: 280px;" ref="upload"
          class="upload-demo retailShopUpload" :auto-upload="true"
          action="/smartLight/web/distridutionBox/upload.htm"
          accept=".xlsx,.xls" :on-success="configPicSuccessImport">
          <el-button size="small" type="primary">点击上传</el-button>
        </el-upload>
        <div class="importTable" v-if="importList.length > 0">
          <div class="importTitle">导入失败数据：</div>
          <div v-for="item in importList" class="tr">
            <span>{{item.name}}:</span><span>({{item.reason}})</span>
          </div>
        </div>
        <div scope="footer" class="dialog-footer" style="text-align: right;margin-top: 10px;">
          <el-button @click="uploadDialog = false">关 闭</el-button>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  // import menuControl from './menuControl.vue'
  import {buttonAuth, resetBreads, sessionOut} from '../../smartlight/common/js/util.js'
  import $ from 'jquery'

  export default {
    data() {
      return {
        saveDeptLoading: false, // 保存部门动画按钮
        filters: {
          deptName: ''
        },
        isshow: true,
        deptList: [],
        teamList: [],
        total: 2,
        page: 1,
        pageSize: 10,
        checkDeptName: false, // 设置修改角色时【角色名称】灰化
        sels: [], // 列表选中列
        listLoading: false,
        showAdd: false,
        addLoading: false,
        companyId: '', // 公司id
        companytype: '', // 公司帐号类型
        tipsTitle: '提示',
        diaAlert: false, // 控制展示登录超时
        deptEntity: {
          id: '',
          name: '',
          lngLat: '',
          deptid: 4,
          treamId: '',
        },
        opType: 'add',
        type: '',
        dialogTitle: '新增配电箱',
        deptFormRules: {
          deptName: [
            {required: true, message: '请输入部门名称', trigger: 'blur'},
            {max: 255, message: '最多输入255个字符', trigger: 'blur'}
          ]
        },
        authButtons: [], // 组件权限按钮ID集合
        adminButtons: [346, 349, 348, 408, 347], // 依次为新增、权限控制、删除、批量删除、编辑
        ebookingButtons: [589, 590, 591, 592, 593], // 依次为新增、权限控制、删除、批量删除、编辑
        mdButtons: [354, 357, 356, 464, 355], // 依次为新增、权限控制、删除、批量删除、编辑
        list: [],
        imgUrl: "https://hdzmsspt.com/file/",
        configPicData: {}, // 图片附件数据
        configPicList: [], // 图片集合
        byqList: [
          {name: "专变", id: "专变"},
          {name: "公变", id: "公变"},
        ],
        czList: [
          {name: "铁箱", id: "铁箱"},
          {name: "不锈钢箱", id: "不锈钢箱"},
        ],
        aztypeList: [
          {name: "座箱", id: "座箱"},
          {name: "挂箱", id: "挂箱"},
          {name: "村箱", id: "村箱"},
        ],
        areaList: [
          {name: "新华街", id: "新华街"},
          {name: "花城街", id: "花城街"},
          {name: "新雅街", id: "新雅街"},
          {name: "秀全街", id: "秀全街"},
          {name: "炭步镇", id: "炭步镇"},
          {name: "赤坭镇", id: "赤坭镇"},
          {name: "花山镇", id: "花山镇"},
          {name: "花东镇", id: "花东镇"},
          {name: "梯面镇", id: "梯面镇"},
          {name: "狮岭镇", id: "狮岭镇"},
        ],
        nfList: [
          {name: "是", id: "是"},
          {name: "否", id: "否"},
        ],
        addressStr: "",
        uploadDialog: false,
        importList: [],
        dialogImageUrl: '',
        dialogVisible: false,
        disabled: false
      }
    },
    methods: {
      handleRemove(file) {
        console.log(file);
      },
      handlePictureCardPreview(file) {
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      handleDownload(file) {
        console.log(file);
      },
      getATime(val) {
        this.deptEntity.transformerstart = val
      },
      getBTime(val) {
        this.deptEntity.kzxstart = val
        console.log(val)
      },
      getCTime(val) {
        this.deptEntity.kzxtystart = val
        console.log(val)
      },
      getDTime(val) {
        this.deptEntity.terminalaztime = val
        console.log(val)
      },
      getETime(val) {
        this.deptEntity.wjpowertime = val
        console.log(val)
      },
      configPicError() {
        this.$refs.upload.clearFiles()
      },
      // 图片移除钩子方法
      configPicRemove(file, fileList) {
        console.log(file, fileList)
        this.configPicList = fileList;
        // this.$forceUpdate()
      },
      // 图片上传成功方法
      configPicSuccess(response, file, fileList) {
        console.log(response, fileList)
        this.configPicList = fileList;
        this.$forceUpdate()
      },
      configPicSuccessImport(response, file, fileList) {
        this.importList = response.data.errorFails
        this.$message({
          message: '导入成功',
          type: 'success'
        })
        console.log(response)
      },
      getTeamList() {
        var para = {
          pageNumber: 1,
          pageSize: 10000,
          type: this.companytype,
          deptid: 4
        }

        this.$http.post('/smartLight/web/sysTream/getList.htm', para).then(response => {
          var resBody = response.body
          if (resBody.isSuccess === 0) {
            console.log(resBody.result)
            this.teamList = resBody.result.content
          }
        })
      },
      checkIfLogin() { // 判断是否登录超时
        var user = sessionStorage.getItem('user')
        if (!user) {
          this.$alert('登录超时，请重新登录！', ' ', {
            type: 'warning'
          }).then(() => {
            this.$router.push({path: '/login'})
            sessionStorage.clear()
          })
        } else {
          return true
        }
      },

      aginLogin() { // 登录超时后点击【确定】按钮事件--单仕瑞--2017年4月25日 16:36:53
        this.diaAlert = false
        this.$router.push({path: '/login'})
        sessionStorage.clear()
      },
      clearValidate() {
        this.$refs['dept'].resetFields()
      },

      handleSizeChange(val) { // 改变页面展示条数时触发重新查询--单仕瑞--2017年4月12日 13:44:41
        this.pageSize = val
        this.getList()
      },
      handleCurrentChange(val) { // 改变页面展示条数时触发重新查询--单仕瑞--2017年4月12日 13:44:41
        this.page = val
        this.getList()
      },
      search() { // 根据【角色名称】查询--单仕瑞--2017年4月20日 15:31:56
        if (!this.checkIfLogin()) {
          return
        }
        this.page = 1;
        this.getList()
      },
      selsChange: function (sels) { // 设置选中列----单仕瑞--2017年4月12日 13:44:41
        this.sels = sels
      },
      handleAdd() { // 控制新增角色时的弹出层--单仕瑞--2017年4月12日 13:44:41
        this.checkDeptName = false
        this.showAdd = true
        this.opType = 'add'
        this.dialogTitle = '新增配电箱'
        this.deptEntity.treamId = ''
        this.configPicList = [];
        var user = JSON.parse(sessionStorage.getItem('user'))
        this.deptEntity = {
          id: '',
          name: '',
          lngLat: '',
         deptid: 4,
//          treamId: user.treamId
        }
      },
      handleSubmit() { // 新增部门or修改部门时的提交
        if (!this.checkIfLogin()) {
          return
        }
        if (this.deptEntity.lngLat.indexOf("，") > -1) {
          this.deptEntity.lngLat = this.deptEntity.lngLat.replace(/，/ig, ',');
        }
        if (this.deptEntity.lngLat.indexOf(",") == -1) {
          this.$message.error('经纬度请用逗号分割！');
          return false
        }
        this.$refs.dept.validate((valid) => {
          if (valid) {
            if (this.dialogTitle == '编辑配电箱') {
              this.$confirm('确认编辑该配电箱吗？', '提示', {
                type: 'warning'
              }).then(() => {
                this.toSubmit()
              }).catch(() => {
                return
              })
            } else {
              this.toSubmit()
            }
          }
        })
      },
      toSubmit() {
        console.log(11111)
        if (this.$refs.upload) {
          this.$refs.upload.submit()
        }
        console.log(22222)
        var dept = {}
        var url = '/smartLight/web/distridutionBox/save.htm'
        // 由于添加和更新的传参方式不同，此处分开处理
        dept.boxInfo = this.deptEntity;
        if (dept.boxInfo.jointransformer != "专变") {
          dept.boxInfo.zbcapacity = ""
          dept.boxInfo.zbcapacityaddress = ""
          dept.boxInfo.transformercompant = ""
          dept.boxInfo.capacitytype = ""
          dept.boxInfo.transformercompantno = ""
          dept.boxInfo.transformerstart = ""
          dept.boxInfo.ratedcurrent = ""
          dept.boxInfo.aload = ""
          dept.boxInfo.bload = ""
          dept.boxInfo.cload = ""
        }
        if (dept.boxInfo.iswjpower == "否") {
          dept.boxInfo.wjpowername = ""
          dept.boxInfo.wjpowernum = ""
          dept.boxInfo.wjpower = ""
          dept.boxInfo.wjpowertime = ""
          dept.boxInfo.wjstate = ""
        }
        var arr = [];
        this.configPicList.forEach((item) => {
          if (item.response) {
            arr.push(item.response)
          } else {
            arr.push(item.url.replace(this.imgUrl, ""))
          }
        })
        dept.boxInfo.pic = arr.toString();
//        dept.boxInfo.kzxstart = dateFormatter(dept.boxInfo.kzxstart)
//        dept.boxInfo.kzxtystart = dateFormatter(dept.boxInfo.kzxtystart)
//        dept.boxInfo.wjpowertime = dateFormatter(dept.boxInfo.wjpowertime)
//        dept.boxInfo.transformerstart = dateFormatter(dept.boxInfo.wjpowertime)


        console.log(dept)
        if (this.opType != 'edit') {
          delete dept.id
        }
//        if (this.opType === 'edit') {
//          dept.id = this.deptEntity.id
//          dept.name = this.deptEntity.name.trim()
//          dept.lngLat = this.deptEntity.lngLat.trim()
//          dept.deptid = this.deptEntity.deptid
//          dept.treamId = this.deptEntity.treamId
//          dept.type = this.companytype
//        } else {
//          dept.name = this.deptEntity.name.trim()
//          dept.lngLat = this.deptEntity.lngLat.trim()
//          dept.deptid = this.deptEntity.deptid
//          dept.treamId = this.deptEntity.treamId
//          dept.type = this.companytype
//        }
        this.addLoading = true
        this.saveDeptLoading = true
        console.log(dept.deptid)
        this.doUpdate(url, dept)
      },
      initDeptList() { // 初始化查询角色列表信息--单仕瑞--2017年4月12日 13:44:41
        this.listLoading = true

        var para = {
          pageNumber: 1,
          pageSize: 100,
          companyType: this.companytype,
          type: this.companytype,
          companyId: this.companyId
        }

        this.$http.post('/smartLight/web/sysDept/getList.htm', para).then(response => {
          var resBody = response.body
          if (resBody.isSuccess === 0) {
            this.deptList = resBody.result.content
            this.listLoading = false
          } else if (resBody.isSuccess === 2) {
            this.listLoading = false
            sessionOut(this) // session超时处理
          } else {
            this.$message({
              showClose: true,
              message: resBody.errorMsg,
              type: 'error'
            })
          }
        })
      },
      getList() { // 初始化查询角色列表信息--单仕瑞--2017年4月12日 13:44:41
        this.listLoading = true
        var user = JSON.parse(sessionStorage.getItem('user'))
        console.log(user)
        var para = {
          pageNumber: this.page,
          pageSize: this.pageSize,
          type: this.companytype,
          deptId: user.roleId == 315 ? "" : user.deptId,
          treamId: user.treamId,
          name: this.addressStr
        }
        console.log(para)
        this.$http.post('/smartLight/web/distridutionBox/getList.htm', para).then(response => {
          var resBody = response.body
          console.log(resBody)
          if (resBody.isSuccess === 0) {
            console.log(resBody.result.content)
            this.list = resBody.result.content
            this.total = resBody.result.totalElements
            this.listLoading = false
          } else if (resBody.isSuccess === 2) {
            this.listLoading = false
            sessionOut(this) // session超时处理
          } else {
            this.$message({
              showClose: true,
              message: resBody.errorMsg,
              type: 'error'
            })
          }
        })
      },
      doUpdate(url, params) { // 对后台操作后的结果在页面展示（成功or失败
        console.log(params)
        this.$http.post(url, params).then(response => {
          this.saveDeptLoading = false
          var resBody = response.body
          console.log(resBody)
          if (resBody.isSuccess === 0) {
            this.showAdd = false
            this.addLoading = false
            this.$message({
              showClose: true,
              message: '操作成功',
              type: 'success'
            })
            this.getList()
          } else if (resBody.isSuccess === 2) {
            this.listLoading = false
            sessionOut(this) // session超时处理
          } else {
            this.$message({
              showClose: true,
              message: resBody.errorMsg,
              type: 'error'
            })
          }
        })
      },
      handleEdit(index, row) { // 控制修改角色时的弹出层--单仕瑞--2017年4月12日 13:44:41
        this.checkDeptName = false
        this.showAdd = true
        this.opType = 'edit'
        this.dialogTitle = '编辑配电箱'
        var params = {
          boxId: row.id,
          type: this.loginType
        }
        this.$http.post('/smartLight/web/distridutionBox/getById.htm', params).then(response => {
          var resBody = response.body
          if (resBody.isSuccess === 0) {
            this.deptEntity = resBody.result
            if (this.deptEntity.pic) {
              var arr = this.deptEntity.pic ? this.deptEntity.pic.split(",").map(item => {
                return {url: this.imgUrl + item}
              }) : []
              this.configPicList = arr;
            }
            console.log(resBody.result)
          } else if (resBody.isSuccess === 2) {
            this.listLoading = false
            sessionOut(this) // session超时处理
          } else {
            this.$message({
              showClose: true,
              message: resBody.errorMsg,
              type: 'error'
            })
          }
        })
//        this.deptEntity = Object.assign({}, row)
        console.log(this.deptEntity)

      },
      handleDelete(index, row) { // 需要删除的id--单仕瑞--2017年4月12日 13:44:41
        var ids = []
        ids.push(row.id)
        this.deleteDept(ids)
      },
      handleDetail(index, row) {
        this.$router.push({path: '/pdBoxDetail?id=' + row.id})
      },
      runNumber(index, row) {
        var that = this;
        Ajax.post('https://hdzmsspt.com/api/box/calculate', "boxId=" + row.id, function (data) {
          var data = JSON.parse(data)
          if (data.code == 0) {
            that.$message.success(data.msg)
          } else {
            that.$message.error(data.msg)
          }
        })
      },
      batchDelete() { // 批量删除的id集合--单仕瑞--2017年4月12日 13:44:41
        var ids = []
        this.sels.map(item => {
          ids.push(item.id)
        })
        this.deleteDept(ids)
      },
      exportExcel() { // 批量删除的id集合--单仕瑞--2017年4月12日 13:44:41
        var para = {};
        var ids = []
        this.sels.map(item => {
          ids.push(item.id)
        })
        para.id = ids.toString()
        this.$http.post('/smartLight/web/distridutionBox/exportExcle.htm', para).then(response => {
          var resBody = response.body
          console.log(resBody)
          if (resBody.isSuccess === 0) {
            location.href = 'https://hdzmsspt.com/file/' + resBody.result
          } else if (resBody.isSuccess === 2) {
            sessionOut(this) // session超时处理
          } else {
            this.$message({
              showClose: true,
              message: resBody.errorMsg,
              type: 'error'
            })
          }
        })
      },
      importExcel() {

      },
      deleteDept(ids) { // 进行删除的方法--单仕瑞--2017年4月12日 13:44:41
        if (!this.checkIfLogin()) {
          return
        }
        this.$confirm('确认删除选中记录吗？', '提示', {
          type: 'warning'
        }).then(() => {
          this.$http.post('/smartLight/web/distridutionBox/delById.htm', ids + '|' + this.companytype).then(response => {
            var resBody = response.body
            if (resBody.isSuccess === 0 && resBody.errorMsg === '') {
              this.$message({
                showClose: true,
                message: '操作成功',
                type: 'success'
              })
              this.getList()
            } else if (resBody.isSuccess === 2) {
              this.listLoading = false
              sessionOut(this) // session超时处理
            } else {
              this.$message({
                showClose: true,
                message: '操作失败，' + resBody.errorMsg,
                type: 'error'
              })
              this.getList()
            }
          })
        }).catch(() => {
        })
      },
      // 获取页面按钮权限
      getAuth(index) {
        return buttonAuth(index, this.companytype, this.adminButtons, this.ebookingButtons, this.mdButtons)
      },
      // 面包屑处理 flag=0 权限控制进入;flag=1 权限控制提交
      updateBreads(flag) {
        var breads = this.$store.state.breads
        if (flag === 0) {
          if (breads.indexOf('权限控制') === -1) { // 不包含
            breads.push('权限控制')
          } else {
            breads.splice(breads.length - 1, 1)
          }
          this.$store.dispatch('updateBreads', breads)
        } else if (flag === 1) {
          if (breads.indexOf('权限控制') !== -1) {
            breads.splice(breads.length - 1, 1)
            this.$store.dispatch('updateBreads', breads)
          }
        }
      },
    },
    mounted() { // 钩子函数，相当于进入页面后的初始化
      var user = sessionStorage.getItem('user')
      if (user) {
        user = JSON.parse(user)
        this.loginType = user.type
        this.companytype = user.type
        this.companyId = user.companyId
        this.deptEntity.deptName = this.deptName
        // 浏览器向前或向后处理
        resetBreads(this)
      }
      this.initDeptList()
      this.getList()
      this.getTeamList()
    },
    components: {
      // menuControl
    }
  }

  function dateFormatter(str) {//默认返回yyyy-MM-dd HH-mm-ss
    var hasTime = arguments[1] != false ? true : false;//可传第二个参数false，返回yyyy-MM-dd
    var d = new Date(str);
    var year = d.getFullYear();
    var month = (d.getMonth() + 1) < 10 ? '0' + (d.getMonth() + 1) : (d.getMonth() + 1);
    var day = d.getDate() < 10 ? '0' + d.getDate() : d.getDate();
    var hour = d.getHours() < 10 ? '0' + d.getHours() : d.getHours();
    var minute = d.getMinutes() < 10 ? '0' + d.getMinutes() : d.getMinutes();
    var second = d.getSeconds() < 10 ? '0' + d.getSeconds() : d.getSeconds();
    if (hasTime) {
      return [year, month, day].join('-') + " " + [hour, minute, second].join(':');
    } else {
      return [year, month, day].join('-');
    }
  }

  var Ajax = {
    get: function (url, fn) {
      // XMLHttpRequest对象用于在后台与服务器交换数据
      var xhr = new XMLHttpRequest();
      xhr.open('GET', url, true);
      xhr.onreadystatechange = function () {
        // readyState == 4说明请求已完成
        if (xhr.readyState == 4 && xhr.status == 200 || xhr.status == 304) {
          // 从服务器获得数据
          fn.call(this, xhr.responseText);
        }
      };
      xhr.send();
    },
    // datat应为'a=a1&b=b1'这种字符串格式，在jq里如果data为对象会自动将对象转成这种字符串格式
    post: function (url, data, fn) {
      var xhr = new XMLHttpRequest();
      xhr.open("POST", url, true);
      // 添加http头，发送信息至服务器时内容编码类型
      xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
      xhr.onreadystatechange = function () {
        if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
          fn.call(this, xhr.responseText);
        }
      };
      xhr.send(data);
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  .is-light
    max-width: 600px;

  .tabRow
    font-size: 12px;

  .button-align
    float: right;

  .el-dialog--small
    width: 37%;

  .prompt
    color: #ff4949
    line-height: 10px !important;
    display: block;

  #formheight
    margin-left: -15px;
    margin-right: 10px;
    height: 38px;

    .el-form-item__content
      height: 30px;

    .el-input
      height: 30px;

      .el-input__inner
        height: 30px;

  .borderStyle
    .el-input .el-input__inner {
      border-color: #ff4949 !important;
    }

  #pagination
    background-color: transparent

    .el-input__inner
      width: 120px

  .retailShopUpload
    display inline-block;

  .uploadImg {
    width 150px;
    height 200px;
  }

  .el-dialog__body .title {
    line-height 45px;
    font-size 16px;
    padding-left 20px;
    color #999;
  }

  .el-dialog__body .line {
    border-bottom 1px solid #e5e5e5;
    width 90%;
    margin 0 auto;
    margin-bottom 20px;
  }

  .el-date-editor.el-input {
    width 100%;
  }

  /deep/ .hideUpload .el-upload--picture-card {
    display none
  }
</style>
<style lang="stylus" rel="stylesheet/stylus">
  .el-dialog--small {
    width 1000px !important;
  }

  .el-dialog--small .el-form-item {
    width 45%;
    display inline-block;
  }
</style>
